<!--
 * @Author: your name
 * @Date: 2021-06-19 13:37:52
 * @LastEditTime: 2021-06-22 11:46:04
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \html和css\jd\index.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>京东(JD.COM)-正品低价、品质保障、配送及时、轻松购物！</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="Keywords" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,京东" />
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/index.css">
    <title>Document</title>
</head>
<body>
    <!-- 京东顶部开始 -->
    <div class="J_event">
        <a href="#" class="w">
            <i>&#xe6a0;</i>
        </a>
    </div>
    <!-- 京东顶部结束 -->
    <!-- 快捷导航模块制作开始 -->
    <div class="shortcut">
        <div class="w">
            <ul class="fl">
                <li>
                    <i>&#xe6a7;</i>
                    北京
                </li>
            </ul>
            <ul class="fr">
                <li>
                    <a href="#">您好，请登录&nbsp;&nbsp;</a>
                    <a href="#" class="style-red">免费注册</a>
                    <span class="span">|</span>
                </li>
                <li>
                    <a href="#">我的订单</a>
                    <span class="span">|</span>
                </li>
                <li class="dropdown">
                    <a href="#">我的京东</a>
                    <i>&#xe69b;</i>
                    <span class="span">|</span>
                </li>
                <li>
                    <a href="#">京东会员</a>
                    <span class="span">|</span>
                </li>
                <li>
                    <a href="#">企业采购</a>
                    <span class="span">|</span>
                </li>
                <li class="dropdown">
                    <a href="#">客户服务</a>
                    <i>&#xe69b;</i>
                    <span class="span">|</span>
                </li>
                <li class="dropdown">
                    <a href="#">网站导航</a>
                    <i>&#xe69b;</i>
                    <span class="span">|</span>
                </li>
                <li>
                    <a href="#">手机京东</a>
                    <div class="erweima">
                        <img src="images/erweima.png" alt="">
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <!-- 快捷导航模块制作结束 -->
    <!-- header部分开始 -->
    <div class="header">
        <div class="w inner">
            <!-- logo部分 -->
            <div class="logo">
                <h1>
                    <a href="#" title="京东网">京东</a>
                </h1>
            </div>
            <!-- search部分 -->
            <div class="search">
                <input type="value" value="单反相机">
                <button>
                    <i>&#xe6ec;</i>
                </button>
                <em></em>
            </div>
            <!-- hotwords部分 -->
            <div class="hotwords">
                <a href="#" class="style-red">学生专享</a>
                <a href="#">300减100</a>
                <a href="#">七折返场</a>
                <a href="#">骑行运动</a>
                <a href="#">家电榜单</a>
                <a href="#">无损播放器</a>
                <a href="#">汽车脚垫</a>
                <a href="#">巧克力</a>
                <a href="#">铝合金门窗</a>
            </div>
            <!-- 购物车 -->
            <div class="MyCar">
                <i>&#xe6e6;</i>
                <a href="#" class="style-red">我的购物车</a>
                <s>0</s>
            </div>
            <!-- computer -->
            <div class="computer">
                <a href="#">
                    <img src="images/computer.jpg" alt="">
                </a>
            </div>
            <!-- navitem -->
            <div class="navitem">
                <ul>
                    <li><a href="#">秒杀</a></li>
                    <li><a href="#">优惠券</a></li>
                    <li><a href="#">闪购</a></li>
                    <li><a href="#">拍卖</a></li>
                    <span class="span">|</span>
                </ul>
                <ul>
                    <li><a href="#">京东服饰</a></li>
                    <li><a href="#">京东超市</a></li>
                    <li><a href="#">生鲜</a></li>
                    <li><a href="#">全球购</a></li>
                    <span class="span">|</span>
                </ul>
                <ul>
                    <li><a href="#">京东金融</a></li>
                </ul>
            </div>
        </div>
    </div>
    <!-- header部分结束 -->
    <!-- main部分开始 -->
    <div class="main">
        <div class="w jd-inner">
            <div class="jd-col1">
                <ul>
                    <li><a href="#">家用电器</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                    <li><a href="#">手机</a><span>/</span><a href="#">运营商</a><span>/</span><a href="#">数码</a></li>
                </ul>
            </div>
            <div class="jd-col2">
                <div class="banner">
                    <img src="images/banner.jpg" alt="">
                    <ul>
                        <li class="current"></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
                </div>
                <div class="left">
                    <img src="images/pic1.jpg" alt="">
                </div>
                <div class="right">
                    <img src="images/pic2.jpg" alt="">
                </div>
            </div>
            <div class="jd-col3">
                <div class="user">
                    <div class="user-info">
                        hi!欢迎来到京东!
                        <br>
                        <a href="#">登录</a>
                        <a href="#">注册</a>
                        <a href="#"><img src="images/no_login.jpg" alt=""></a>
                    </div>
                    <div class="user-profit">
                        <a href="#">新人福利</a>
                        <a href="#">plus会员</a>
                    </div>                  
                </div>
                <div class="news">
                    <div class="tab-hd">
                        <a href="javascript:;" class="cuxiao">促销</a>
                        <a href="javascript:;">公告</a>
                        <a href="javascript:;" class="more">更多</a>
                        <div class="line"></div>
                    </div>
                    <div class="tab-bd">
                        <ul>
                            <li><a href="#">蓄电池专场下单立减100元</a></li>
                            <li><a href="#">蓄电池专场下单立减100元</a></li>
                            <li><a href="#">蓄电池专场下单立减100元</a></li>
                            <li><a href="#">蓄电池专场下单立减100元</a></li>
                        </ul>
                    </div>
                </div>
                <div class="jipiao">
                    <ul>
                        <li><a href="#"><i></i>机票</a></li>
                        <li><a href="#"><i></i>机票</a></li>
                        <li><a href="#"><i></i>机票</a></li>
                        <li><a href="#"><i></i>机票</a></li>
                    </ul>
                    <ul>
                        <li><a href="#"><i></i>机票</a></li>
                        <li><a href="#"><i></i>机票</a></li>
                        <li><a href="#"><i></i>机票</a></li>
                        <li><a href="#"><i></i>机票</a></li>
                    </ul>
                    <ul>
                        <li><a href="#"><i></i>机票</a></li>
                        <li><a href="#"><i></i>机票</a></li>
                        <li><a href="#"><i></i>机票</a></li>
                        <li><a href="#"><i></i>机票</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- 广告部分开始 -->
        <div class="ad">
            <a href="#"></a>
        </div>
        <!-- 广告部分结束 -->
    </div>
     <!-- main部分结束 -->
     <!-- 服务模块开始 -->
     <div class="footer">
        <div class="footer-service">
            <div class="footer-service-inner w">
                <ul class="clearfix">
                    <li>
                        <div class="service_unit">
                            <h5 class="duo">多</h5>
                            <p>品类齐全，轻松购物</p>
                        </div>
                    </li>
                    <li>
                        <div class="service_unit">
                            <h5 class="kuai">快</h5>
                            <p>多仓直发,极速配送</p>
                        </div>
                    </li>
                    <li>
                        <div class="service_unit">
                            <h5 class="hao">好</h5>
                            <p>正品行货，精致服务</p>
                        </div>
                    </li>
                    <li>
                        <div class="service_unit">
                            <h5 class="sheng">省</h5>
                            <p>天天低价，畅选无忧</p>
                        </div>
                    </li>
                </ul>
               
            </div>
        </div>
        <!-- 帮助模块 -->
        <div class="w help">
            <dl>
                <dt>购物指南</dt>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">会员介绍</a></dd>
                <dd><a href="#">生活旅行</a></dd>
                <dd><a href="#">常见问题</a></dd>
                <dd><a href="#">大家电</a></dd>
                <dd><a href="#">联系客服</a></dd>
            </dl>
            <dl>
                <dt>购物指南</dt>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">会员介绍</a></dd>
                <dd><a href="#">生活旅行</a></dd>
                <dd><a href="#">常见问题</a></dd>
                <dd><a href="#">大家电</a></dd>
                <dd><a href="#">联系客服</a></dd>
            </dl>
            <dl>
                <dt>购物指南</dt>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">会员介绍</a></dd>
                <dd><a href="#">生活旅行</a></dd>
                <dd><a href="#">常见问题</a></dd>
                <dd><a href="#">大家电</a></dd>
                <dd><a href="#">联系客服</a></dd>
            </dl>
            <dl>
                <dt>购物指南</dt>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">会员介绍</a></dd>
                <dd><a href="#">生活旅行</a></dd>
                <dd><a href="#">常见问题</a></dd>
                <dd><a href="#">大家电</a></dd>
                <dd><a href="#">联系客服</a></dd>
            </dl>
            <dl>
                <dt>购物指南</dt>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">会员介绍</a></dd>
                <dd><a href="#">生活旅行</a></dd>
                <dd><a href="#">常见问题</a></dd>
                <dd><a href="#">大家电</a></dd>
                <dd><a href="#">联系客服</a></dd>
            </dl>
            <dl class="cover">
                <dt>京东自营覆盖区县</dt>
                <dd class="info">京东已向全国2661个区县提供自营配送服务，支持货到付款、POS机刷卡和售后上门服务。
                </dd>
                <dd class="more"><a href="#">查看详情 > </a></dd>
                
            </dl>
   </div>

<!-- 版权模块 -->
<div class="w copyright">			
        <div class="links">
            <a href="#">关于我们</a>
            <span>|</span>
            <a href="#">关于我们</a>
            <span>|</span>
            <a href="#">关于我们</a>
            <span>|</span>
            <a href="#">关于我们</a>
            <span>|</span>
            <a href="#">关于我们</a>
            <span>|</span>
            <a href="#">关于我们</a>
            <span>|</span>
            <a href="#">关于我们</a>
            <span>|</span>
            <a href="#">关于我们</a>
            <span>|</span>
            <a href="#">关于我们</a>
            <span>|</span>
            <a href="#">关于我们</a>
            <span>|</span>
            <a href="#">关于我们</a>
            <span>|</span>
            
            <a href="#">English</a>
            <span>|</span>
            <a href="#">Site</a>
            <span>|</span>
            <a href="#">Media & IR</a>
            <span>|</span>
        </div>

        <div class="c-info">
            <p>京公网安备 11000002000088号|京ICP证070359号|互联网药品信息服务资格证编号(京)-经营性-2014-0008|新出发京零 字第大120007号</p>
            <p>互联网出版许可证编号新出网证(京)字150号|出版物经营许可证|网络文化经营许可证京网文[2014]2148-348号|违法和不良信息举报电话：4006561155</p>
            <p>Copyright © 2004 - 2017  京东JD.com 版权所有|消费者维权热线：4006067733经营证照</p>
            <p>京东旗下网站：京东支付|京东云</p>
        </div>
        <div class="tupian">
            <a href="#"></a>
            <a href="#" class="kexin"></a>
            <a href="#"></a>
            <a href="#"></a>
            <a href="#"></a>
            <a href="#"></a>
        </div>
</div>
     </div>
     <!-- 服务模块结束 -->
</body>
</html>